import React, { useState } from 'react'
import { View, Text,Image} from '@tarojs/components'
import './index.less'
import Searchcard from '../Searchcard'

export default function Iconcard(props) {
  var tags = ['简介','配料','过程']
  const [current,setcurrent] = useState(0)
  var list = [props.content,props.material,props.process]
  var fn = (index)=>{
      setcurrent(index)
      console.log(111);
  }
  return (
    <View className='select_box'>
        <View className='titles'>
          {
            tags&&tags.map((item,index)=><View className={index==current?'title_active':''} onClick={()=>fn(index)}>{item}</View>)
          }
        </View>
        <View className='select_content'>
            {
              current==0&&list[current]
            }
            {
              current==1&&list[current].map(item=><View className='material' key={item.mname}><View className='m_name'>{item.mname}</View><View className='m_num'>{item.amount}</View></View>)
            }
            {
              current==2&&list[current].map((item,index)=><Searchcard pic={item.pic} type='s3' pcontent={item.pcontent} index={index} key={item.pcontent}></Searchcard>)
            }
        </View>
    </View>
  )
}
